﻿@*
    For more information on enabling MVC for empty projects, visit https://go.microsoft.com/fwlink/?LinkID=397860
*@
@{
    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>生产工单主表</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="~/scripts/layui-v2.5.6/layui/css/layui.css" rel="stylesheet" />
    <style>
        .search-box {
            padding: 15px;
            background-color: #f2f2f2;
            margin-bottom: 15px;
        }
        .layui-form-label {
            width: 100px;
        }
        .layui-input-block {
            margin-left: 130px;
        }
        .footer-buttons {
            position: fixed;
            bottom: 0;
            left: 0;
            right: 0;
            padding: 10px;
            text-align: center;
            background-color: #fff;
            border-top: 1px solid #e6e6e6;
        }
        /* 添加行悬停和选中效果 */
        .layui-table-hover {
            background-color: #f2f2f2 !important;
        }
        .layui-table-click {
            background-color: #e6e6e6 !important;
        }
        /* 让整行可点击的样式 */
        .layui-table tbody tr {
            cursor: pointer;
        }
    </style>
</head>
<body>
    <div class="layui-fluid">
        <!-- 搜索条件 -->
        <div class="search-box">
            <form class="layui-form" action="">
                <div class="layui-row layui-col-space15">
                    <div class="layui-col-md3">
                        <div class="layui-form-item">
                            <label class="layui-form-label">工单编码</label>
                            <div class="layui-input-block">
                                <input type="text" name="WorkOrderCode" placeholder="请输入工单编码" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md3">
                        <div class="layui-form-item">
                            <label class="layui-form-label">工单名称</label>
                            <div class="layui-input-block">
                                <input type="text" name="WorkOrderName" placeholder="请输入工单名称" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md3">
                        <div class="layui-form-item">
                            <label class="layui-form-label">产品编号</label>
                            <div class="layui-input-block">
                                <input type="text" name="ProductCode" placeholder="请输入产品编号" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md3">
                        <div class="layui-form-item">
                            <label class="layui-form-label">产品名称</label>
                            <div class="layui-input-block">
                                <input type="text" name="ProductName" placeholder="请输入产品名称" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-row">
                    <div class="layui-col-md12" style="text-align: center;">
                        <button type="button" class="layui-btn" lay-submit lay-filter="searchForm">
                            <i class="layui-icon layui-icon-search"></i> 搜索
                        </button>
                        <button type="reset" class="layui-btn layui-btn-primary">
                            <i class="layui-icon layui-icon-refresh"></i> 重置
                        </button>
                    </div>
                </div>
            </form>
        </div>

        <!-- 数据表格 -->
        <table class="layui-hide" id="productionWorkOrderTable" lay-filter="productionWorkOrderTable"></table>

        <!-- 底部按钮 -->
        <div class="footer-buttons">
            <button type="button" class="layui-btn" id="confirmBtn">确定</button>
            <button type="button" class="layui-btn layui-btn-primary" onclick="parent.layer.close(parent.layer.getFrameIndex(window.name))">取消</button>
        </div>
    </div>

    <script src="~/scripts/jquery-3.4.1.min.js"></script>
    <script src="~/scripts/layui-v2.5.6/layui/layui.js"></script>
    <script>
        layui.use(['table', 'form', 'layer'], function(){
            var table = layui.table;
            var form = layui.form;
            var layer = layui.layer;
            var selectedData = null;
            
            // 初始化表格
            table.render({
                elem: '#productionWorkOrderTable'
                ,url: '/ProductionReport/GetProductionWorkOrderMain'
                ,method: 'get'
                ,toolbar: '#toolbarDemo'
                ,defaultToolbar: ['filter', 'exports', 'print']
                ,title: '生产工单主表'
                ,cols: [[
                    {type: 'radio', fixed: 'left'}  // 添加单选框
                    ,{field: 'workOrderCode', title: '工单编码', width: 150}
                    ,{field: 'workOrderName', title: '工单名称', width: 150}
                    ,{field: 'sourceType', title: '来源类型', width: 120}
                    ,{field: 'orderCode', title: '订单编号', width: 150}
                    ,{field: 'documentStatus', title: '单据状态', width: 100, templet: function(d){
                        var statusMap = {
                            0: '草稿',
                            1: '已审核',
                            2: '已关闭'
                        };
                        return statusMap[d.documentStatus] || d.documentStatus;
                    }}
                    ,{field: 'workOrderType', title: '工单类型', width: 120}
                    ,{field: 'productCode', title: '产品编号', width: 150}
                    ,{field: 'productName', title: '产品名称', width: 150}
                    ,{field: 'productModel', title: '规格型号', width: 120}
                    ,{field: 'unit', title: '单位', width: 80}
                    ,{field: 'workOrderQuantity', title: '工单数量', width: 100}
                    ,{field: 'demandDate', title: '需求日期', width: 160, templet: function(d){
                        return d.demandDate ? layui.util.toDateString(new Date(d.demandDate), 'yyyy-MM-dd') : '';
                    }}
                    ,{field: 'batchNo', title: '批次号', width: 120}
                    ,{field: 'remark', title: '备注', width: 200}
                ]]
                ,page: false
                ,height: 'full-270'  // 减小高度以适应底部按钮
                ,parseData: function(res){
                    return {
                        "code": 0,
                        "msg": "",
                        "count": res.length,
                        "data": res || []
                    };
                }
            });

            // 监听行单选框选中事件
            table.on('radio(productionWorkOrderTable)', function(obj){
                selectedData = obj.data;
            });

            // 添加行点击事件监听
            table.on('row(productionWorkOrderTable)', function(obj){
                // 选中当前行的单选框
                obj.tr.find('input[type="radio"]').prop('checked', true);
                
                // 更新选中数据
                selectedData = obj.data;
                
                // 更新行的选中状态样式
                obj.tr.addClass('layui-table-click').siblings().removeClass('layui-table-click');
                
                // 触发 radio 事件以保持一致性
                layui.form.render('radio');
            });

            // 确定按钮点击事件
            $('#confirmBtn').on('click', function(){
                if(!selectedData) {
                    layer.msg('请选择一条数据');
                    return;
                }
                
                try {
                    // 获取父窗口的jQuery对象
                    var parentWindow = $(parent.document);
                    
                    // 设置工单相关字段
                    parentWindow.find('#workOrder').val(selectedData.workOrderCode);
                    parentWindow.find('#productCode').val(selectedData.productCode);
                    parentWindow.find('#productName').val(selectedData.productName);
                    parentWindow.find('#unit').val(selectedData.unit);
                    parentWindow.find('#productModel').val(selectedData.productModel);
                    
                    // 触发父窗口的表单更新
                    if(parent.layui && parent.layui.form) {
                        parent.layui.form.render();
                    }
                    
                    // 关闭弹窗
                    var index = parent.layer.getFrameIndex(window.name);
                    parent.layer.close(index);
                    
                } catch(e) {
                    console.error('设置数据时出错:', e);
                    layer.msg('数据传递失败：' + e.message);
                }
            });

            // 搜索表单提交
            form.on('submit(searchForm)', function(data){
                selectedData = null;  // 重置选中数据
                table.reload('productionWorkOrderTable', {
                    where: data.field
                });
                return false;
            });
        });
    </script>
</body>
</html>
